<!DOCTYPE html>
<link rel="stylesheet" href="options.css">
<script src="neatools.js"></script>
<script src="options.js"></script>
<!-- <div class="options-nav">
    <a href="advanced-options.html">
        <p id="advanced-options"></p>
    </a>
</div> -->
<h1>
    <img src="icon/icon.svg" width="32" height="32" alt="">
    <span id="ext-name"></span>
    <small id="small-options"></small>
</h1>
<h2 id="general"></h2>
<ul class="options-list">
    <li><label><input type="checkbox" id="click-new-tab"><span id="option-click-new-tab"></span></label></li>
    <li><label><input type="checkbox" id="open-new-tab-bg"><span id="option-open-new-tab-bg"></span></label></li>
    <li><label><input type="checkbox" id="close-unused-folders"><span id="option-close-unused-folders"></span></label></li>
    <li><label><input type="checkbox" id="popup-stay-open"><span id="option-popup-stay-open"></span></label></li>
    <li><label><input type="checkbox" id="confirm-open-folder"><span id="option-confirm-open-folder"></span></label></li>
    <li><label><input type="checkbox" id="remember-prev-state"><span id="option-remember-prev-state"></span></label></li>
    <li><label><input type="checkbox" id="only-show-bmbar"><span id="option-only-show-bmbar"></span></label></li>
    <li><label><input type="checkbox" id="search-after-enter"><span id="option-search-after-enter"></span></label></li>
</ul>
<h2 id="accessibility"></h2>
<ul class="options-list">
    <li><label><span id="option-zoom"></span> <input type="number" min="90" max="150" step="10" value="100" id="zoom-input">%</label></li>
</ul>
<div id="footer">
    <p id="options-footer-1"></p>
    <p id="options-footer-2"></p>
    <p id="options-footer-3"></p>
    <p id="options-footer-4"></p>
</div>